import React from 'react'
import { useLocation, useParams, useSearchParams } from 'react-router-dom'

export default function Detail() {
    // 方案一：解析params参数
    // const params = useParams()
    // console.log("parms >>> ",params)
    // const { id, name } = params

    // 方案二：解析search参数
    // const [search, setSearch] = useSearchParams()
    // console.log("userlocation",useLocation())
    // console.log(search)
    // const id = search.get("id")
    // const name = search.get("name")

    console.log("userlocation",useLocation())
    const {id,name} = useLocation().state
    
    return (
        <div>
            <h5>Detail</h5>
            <ul>
                {/* <li><button onClick={() => { setSearch('id=4&name=niao') }}>更新参数数据</button></li> */}
                <li>id:{id}</li>
                <li>name:{name}</li>
            </ul>
        </div>
    )
}
